<template>
	<div class="index" style="background-color: white;">
		<div class="center">
			<left></left>
			<div class="right">
          		<top></top>
				<div class="hei10"></div>
				<div class="title" >
					<el-page-header @back="goBack" content="客户经理管理"></el-page-header>
				</div>


				<div class="con" v-loading="loading" style="padding:0  30px;">
					<el-button @click="openadd" style="margin-bottom: 30px;background-color: #2974FF;" type="danger" round>添加客户经理</el-button>
					<el-table
					:data="tableData"
					style="width: 100%">
						<el-table-column
							prop="name"
							align="center"
							label="客户经理">
						</el-table-column>
						<el-table-column
							prop="add_time"
							align="center"
							label="添加时间">
						</el-table-column>
						<el-table-column align="center" label="操作">
							<template slot-scope="scope">
								<el-button
								size="mini"
								type="text"
								@click="handleDelete(scope.row)">删除</el-button>
							</template>
						</el-table-column>
					</el-table>
					<!-- <div style="margin-top:20px;text-align:right" >
						<el-pagination background layout="total,prev, pager, next"
						@current-change="fanye" :page-size="20" :total="total"></el-pagination>
					</div> -->

				</div>
			</div>
		</div>
		<!-- 添加弹窗 -->
		<el-dialog
			title="添加客户经理"
			align="center"
			:visible.sync="dialogVisible"
			:close-on-click-modal="false"
			width="520px">
			<el-select style="width:100%" filterable v-model="choosevalue" placeholder="请选择客户经理账号名">
				<el-option
				v-for="item in listk"
				:key="item.id"
				:label="item.name"
				:value="item.id">
				</el-option>
			</el-select>
			<div style="text-align: center;margin-top: 20px;">
				<el-button type="danger" round @click="upmanage">确 定</el-button>
			</div>
		</el-dialog>
	</div>
</template>

<script>
	import axios from 'axios'
	import top from '@/components/top.vue'
	import left from '@/components/left.vue'
	import foot from '@/components/foot.vue'
	export default {
		components: {
			"left": left,
			"top": top,
			"foot": foot
		},
		name: 'managelist',
		data() {
			return {
				tableData: [],
				total:0,
				dialogVisible:false,
				listk: [],
				choosevalue: ''
			}
		},
		created() {
		  //获取列表
		  this.getlist()
		  //获取人员
		  this.getlistk()
		},
		methods: {
			//获取列表
			getlist(){
				axios.get('/api/plan-market/user/userManagerList')
					.then(response => {
						if(response.data.msg.code == 0){
							console.log('列表')
							console.log(response)
							this.tableData = response.data.data
						}else{
							this.$message.error(response.data.msg.info);
						}
					})
			},
			//翻页
			fanye(val){
				console.log(val)
			},
			//返回
			goBack(){
				this.$router.push('/myDistributor')
			},
			//删除
			handleDelete(row){
				this.$confirm('是否确认删除?', '提示', {
					confirmButtonText: '确定',
					cancelButtonText: '取消',
					type: 'warning'
				}).then(() => {
					axios.post('/api/plan-market/user/deleManager',{id:row.id})
					.then(response => {
						if(response.data.msg.code == 0){
							this.$message({
								type: 'success',
								message: '删除成功!'
							});
							this.getlist()
						}else{
							this.$message.error(response.data.msg.info);
						}
					})

				}).catch(() => {
					this.$message({
						type: 'info',
						message: '已取消删除'
					});
				});
			},
			//提交
			upmanage(){
				if(this.choosevalue==''){
					this.$message.error('请选择经理');
					return
				}
				axios.post('/api/plan-market/user/addManager',{id:this.choosevalue})
				.then(response => {
					if(response.data.msg.code == 0){
						this.dialogVisible=false
						this.$message({
							type: 'success',
							message: '操作成功!'
						});
						this.getlist()
					}else{
						this.$message.error(response.data.msg.info);
					}
				})
			},
			//打开弹窗
			openadd(){
				this.choosevalue = ''
				this.dialogVisible=true
			},
			//获取人员
			getlistk() {
				var that = this
				axios.get('/api/plan-market/user/list?page=1&page_size=10000&status=0')
					.then(response => {
						if (response.data.msg.code == 0) {
							that.listk = response.data.data.data
							console.log('客户经理')
							console.log(that.listk)
						} else {
							that.$message.error(response.data.msg.info);
						}
					})
			},
		}

	}
</script>
<style scoped>
.title {
	padding:25px 30px;
}
</style>

